/**
 * #info
 *
 *@author   wuwg
 *@createTime   2018/03/20
 *@updateTime   2018/04/23
 *@description  breadcrumb  component  面包屑组件
 */

/**
 * #item
 *
 * @type        aty-breadcrumb
 * @cn          面包屑
 * @menu        导航
 * @order       25
 * @stPlugin    true
 * @stContainer false
 */

import config from '../../../config/config.js'
// components
import Icon from '../../basic/icon/index.vue'
//  prefix
const prefixCls = config.prefix + '-breadcrumb'
// module
const module = {
  name: prefixCls,
  components: { Icon },
  props: {
    /**
     * #property
     *
     * @name    separator
     * @cn      分隔符符号
     * @type    string
     * @value   /
     * @description 分隔符符号
     */
    separator: {
      type: String,
      default: '/'
    },
    /**
     * #property
     *
     * @name    data
     * @cn      面包屑数据
     * @type    array
     * @required true
     * @bind    must
     * @value   []
     * @description 面包屑数据。数据格式化为： {name:'home', href:'http://www.baidu.com',icon:'ios-home-outline',className:'test1'}，如引入了vue-router，href将作为路由跳转
     */
    data: {
      type: Array,
      default () {
        return [
          /*
           *  {
           * name:'home',
           * href:'http://www.baidu.com',
           * icon:'ios-home-outline',
           * className:'test1'
           *}
           */
        ]
      }
    },
    /**
     * #property
     *
     * @name    replace
     * @cn      是否替当前的路由
     * @type    boolean
     * @value   false
     * @description 是否替当前的路由，替换当前路由将不产生历史记录
     */
    replace: {
      type: Boolean,
      default: false
    },
    /**
     * #property
     *
     * @name    canClick
     * @cn      是否有默认的点击事件
     * @type    boolean
     * @value   false
     * @description 是否有默认的点击事件，如果存在路由将作为路由跳转，否则自动跳转window.location.href=url
     */
    canClick: {
      type: Boolean,
      default: false
    }
  },
  data () {
    return {
      currentData: this.data,
      showSeparator: false,
      scope: {
        className: config.prefix + '-breadcrumb'
      }
    }
  },
  watch: {
    data (newValue) {
      this.currentData = newValue
    }
  },
  computed: {
    classes () {
      return `${prefixCls}`
    },
    // 连接的class
    linkClasses () {
      return `${prefixCls}-item-link`
    },
    // 分隔符的class
    separatorClasses () {
      return `${prefixCls}-item-separator`
    },
    // 数据长度
    len () {
      return this.currentData.length
    }
  },
  methods: {
    click (item, event) {
      /**
       * #event
       *
       * @name    click
       * @param   item    当前点击的条目
       * @param   event    event对象
       * @body    console.log(item+"被点击了！");
       * @description   点击时触发
       */
      this.$emit('click', item, event)
      if (this.canClick) {
        const isRoute = this.$router
        if (isRoute) {
          this.replace ? this.$router.replace(item.href) : this.$router.push(item.href)
        } else {
          window.location.href = item.href
        }
      }
    }
  },
  updated () {
  },
  created () {
  },
  mounted () {
  }
}
export default module
